<template>
	<view class="box">
		<view class="plr20 pt20 pb20">
			<view class="boxItem mb20">
				<view class="flex mb20">
					<view class="name w160">设备名：</view>
					<view class="value">{{objList.fmName}}</view>
				</view>
				<view class="flex mb20">
					<view class="name w160">设备编号：</view>
					<view class="value">{{objList.fmCode}}</view>
				</view>
				<view class="flex mb20">
					<view class="name w160">设备型号：</view>
					<view class="value">{{objList.fmModel}}</view>
				</view>
				<view class="flex mb20">
					<view class="name w160">状态：</view>
					<view class="value">{{objList.fmStatusDesc}}</view>
				</view>
				<view class="flex mb20">
					<view class="name w160">使用部门：</view>
					<view class="value">{{objList.unitName?objList.unitName + objList.depName:''}}</view>
				</view>
				<view class="flex mb20">
					<view class="name">设备使用地点：</view>
					<view class="value">{{objList.location}}</view>
				</view>
				<view class="flex mb20">
					<view class="name">上次维保时间：</view>
					<view class="value">{{objList.lastInspectionMaintenanceDate}}</view>
				</view>
			</view>
			<view class="boxItem mb20">
				<view class="mb30 flex flex-center flex-itemCenter">
					<image src="../../static/iconListingScreening.png" class="wh40"></image>
					<text class="ml10" style="color: #414A53;">排查清单</text>
				</view>
				<view class="mb20" v-for="item in objList.optionsList" :key='item.id'>
					<view class="value">{{item.checkTitle}}</view>
					<u-radio-group v-model="item.result" placement="column" disabled>
						<view class="flex flex-end mt20 mb50">
							<view v-for="(item, index) in radiolist1" :key="index" class="ml30">
								<u-radio :customStyle="{marginBottom: '8px'}" :label="item.name" :name="item.disabled"
									labelSize="28rpx" size="15">
								</u-radio>
							</view>
						</view>
					</u-radio-group>
				</view>
			</view>
			<view class="boxItem mb20">
				<view class="mb30 flex flex-center flex-itemCenter">
					<text class="ml10" style="color: #414A53;">排查记录</text>
				</view>
				<view style="border-bottom: dashed 1px #DCDCDC;" class="ptb30"
				v-for="item in items" :key="item.id">
					<view class="flex mb20">
						<view class="name w160">排查人员：</view>
						<view class="value">{{item.checkUserName}}</view>
					</view>
					<view class="flex mb20">
						<view class="name w160">排查时间：</view>
						<view class="value">{{item.checkDate}}</view>
					</view>
					<view class="flex mb20">
						<view class="name w160">备注：</view>
						<view class="value">{{item.remark}}</view>
					</view>
					<view class="flex mb20">
						<view class="name w160">附件：</view>
						<view class="cob" @click="checkAttac(item.id)">查看</view>
					</view>
				</view>
				<view class="mt30" v-show="showLoading">
					<u-loading-icon mode="circle" text="数据加载中,请稍后......"></u-loading-icon>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				radiolist1: [{
						name: '合格',
						disabled: true
					},
					{
						name: '不合格',
						disabled: false
					},
				],
				itemPages:{
					qrCode:'',
					pageIndex:1,
					pageSize:10
				},
				// 排查设备数据
				objList:{},
				//排查列表
				items:[],
				itemCount:0,
				showLoading:false
			}
		},
		onLoad(e) {
			if(e.fmQrCode){
				this.itemPages.qrCode = e.fmQrCode
				this.request(this.$api.getFmHiddenDangerDetail+ this.itemPages.qrCode, {},'GET').then((res) => {
					console.log(1,res.resultValue)
					this.objList = res.resultValue
				})
				
			}
		},
		created() {
			this.paging()
		},
		onReachBottom(){
			if(this.itemCount > this.items.length){
				this.itemPages.pageIndex++
				console.log('到底了')
				this.paging()
			}
		},
		methods: {
			paging(){
				this.showLoading = true
				this.request(this.$api.getHiddenDangerCheckPageList, this.itemPages,'POST','application/x-www-form-urlencoded').then((res) => {
					console.log(2,res.resultValue)
					this.itemCount = res.resultValue.itemCount
					this.items = this.items.concat(res.resultValue.items)
					this.showLoading = false
				})
			},
			//单选监听变化
			groupChange(n) {
				console.log('groupChange', this.radiovalue1);
			},
			//页面跳转
			navTo(e) {
				uni.navigateTo({
					url: './' + e + '?id='
				})
			},
			//预览
			checkAttac(id) {
				uni.navigateTo({
					url: './../checkTheAttachment/checkTheAttachment?classify=0503&connectId=' + id
				})
			}

		}
	}
</script>

<style scoped>
	.box {
		min-height: 100vh;
		background-color: #F1F2F5;
	}

	.w160 {
		width: 160rpx;
	}

	.boxItem {
		padding: 30rpx;
		background-color: #fff;
		box-shadow: 0 2px 4px 0 rgba(237, 237, 237, 0.50);
		border-radius: 16rpx;
		position: relative;
	}

	.name {
		font-size: 28rpx;
		font-family: PingFangSC-Regular, PingFang SC;
		font-weight: 400;
		color: #89939E;
		padding-right: 20rpx;
	}

	.value {
		flex: 1;
		font-size: 28rpx;
		font-family: PingFangSC-Regular, PingFang SC;
		font-weight: 400;
		color: #333333;
	}

	.cob {
		flex: 1;
		font-size: 28rpx;
		font-family: PingFangSC-Regular, PingFang SC;
		font-weight: 400;
		color: #3473F9;
	}

	>>>.u-textarea {
		margin-bottom: 40rpx;
		background-color: #F5F6F9 !important;
		border: none;
	}

	
	.pdf {
		margin-top: 30rpx;
		width: 120rpx;
		height: 120rpx;
		background-size: 100%;
		background-repeat: no-repeat;
	}
</style>
